<template>
  <div class="box" v-loading="submitBtn || loading">
    <div class="descriptions">
      <div class="user-title-box">增减项-报价单</div>
      <el-descriptions class="descriptions" :column="4" border>
        <el-descriptions-item label="增减项金额" v-if="$fieldShowFunc('zj_change_amount')">
          {{ zjInfo.change_amount }}元
        </el-descriptions-item>
        <el-descriptions-item label="基础装修费" v-if="$fieldShowFunc('zj_basic_decoration_fee')">
          {{ zjInfo.basic_decoration_fee }}元
        </el-descriptions-item>
        <el-descriptions-item label="主材采购费" v-if="$fieldShowFunc('zj_material_costs')">
          {{ zjInfo.material_costs }}元
        </el-descriptions-item>
        <el-descriptions-item label="税金" v-if="$fieldShowFunc('zj_quotation_taxes')">
          {{ zjInfo.quotation_taxes }}元
        </el-descriptions-item>
        <el-descriptions-item label="成本金额" v-if="$fieldShowFunc('zj_cost_amount')">
          {{ zjInfo.cost_amount }}元
        </el-descriptions-item>
        <el-descriptions-item label="现场采购成本" v-if="$fieldShowFunc('zj_procurement_cost')">
          {{ zjInfo.procurement_cost }}元
        </el-descriptions-item>
        <el-descriptions-item label="公司集采成本" v-if="$fieldShowFunc('zj_centralized_procurement_cost')">
          {{ zjInfo.centralized_procurement_cost }}元
        </el-descriptions-item>
        <el-descriptions-item label="管理成本" v-if="$fieldShowFunc('zj_management_costs')">
          {{ zjInfo.management_costs }}元
        </el-descriptions-item>
        <el-descriptions-item label="利润金额" v-if="$fieldShowFunc('zj_profit_amount')">
          {{ zjInfo.profit_amount }}元
        </el-descriptions-item>
        <el-descriptions-item label="利润率" v-if="$fieldShowFunc('zj_profit_ratio')">
          {{ zjInfo.profit_ratio }}%
        </el-descriptions-item>
        <el-descriptions-item label="报价附件" :span="2" v-if="$fieldShowFunc('zj_quotation_file')">
          <div class="file-box-img-box flex ac">
            <template v-for="(item2, idx) in zjInfo.project_quotation_file">
              <div class="file-box-img" v-if="item2.type == 1" :key="idx">
                <el-tooltip class="item" effect="dark" :content="item2.file_name" placement="top">
                  <img class="img" :src="$fileImgFunc(item2)" @click="$fileViewHandle(item2)" />
                </el-tooltip>
              </div>
            </template>
          </div>
        </el-descriptions-item>
        <el-descriptions-item label="成本附件" :span="2" v-if="$fieldShowFunc('zj_cost_list_file')">
          <div class="file-box-img-box flex ac">
            <template v-for="(item2, idx) in zjInfo.project_quotation_file">
              <div class="file-box-img" v-if="item2.type == 2" :key="idx">
                <el-tooltip class="item" effect="dark" :content="item2.file_name" placement="top">
                  <img class="img" :src="$fileImgFunc(item2)" @click="$fileViewHandle(item2)" />
                </el-tooltip>
              </div>
            </template>
          </div>
        </el-descriptions-item>
        <el-descriptions-item label="利润附件" :span="2" v-if="$fieldShowFunc('zj_profit_statement_file')">
          <div class="file-box-img-box flex ac">
            <template v-for="(item2, idx) in zjInfo.project_quotation_file">
              <div class="file-box-img" v-if="item2.type == 3" :key="idx">
                <el-tooltip class="item" effect="dark" :content="item2.file_name" placement="top">
                  <img class="img" :src="$fileImgFunc(item2)" @click="$fileViewHandle(item2)" />
                </el-tooltip>
              </div>
            </template>
          </div>
        </el-descriptions-item>
      </el-descriptions>
    </div>
    <div class="descriptions">
      <div class="user-title-box">审核操作</div>
      <el-form :model="formData" ref="elFrom" :rules="formRules" label-position="top" label-width="120px"
        class="el-form">
        <el-form-item label="" required>
          <el-radio-group v-model="formData.reviewPassed">
            <el-radio :label="1">通过</el-radio>
            <el-radio :label="2">拒绝</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="拒绝理由" prop="remark" v-if="formData.reviewPassed == 2">
          <el-input :rows="4" class="input-box" v-model="formData.remark" type="textarea"
            placeholder="请输入拒绝理由"></el-input>
        </el-form-item>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="saveSubmit" :loading="submitBtn">提交</el-button>
        <el-button @click="cancelFunc">关闭</el-button>
      </div>
    </div>

  </div>
</template>
<script>
import idiApi from '@/api/increaseDecreaseItemsApi';

export default {
  name: 'idiExamine',
  data() {
    let validateRemark = (rule, value, callback) => {
      console.log(value)
      if (this.formData.reviewPassed == 2 && !value) {
        callback(new Error('请输入拒绝理由'));
      } else {
        callback();
      }
    };
    return {
      changeInfo: {},
      zjInfo: {},
      loading: false,
      editType: 'add',
      formData: {
        id: '',
        reviewPassed: 1,
        remark: '',
      },
      formRules: {
        remark: { required: true, validator: validateRemark, trigger: "change" },
      },
      submitBtn: false,
    };
  },
  computed: {
  },
  mounted() {
    let id = this.$route.query.sn
    if (id) {
      idiApi.getChangeDetails({ change_id: id }).then(res => {
        console.log(res, '增减项详情')
        if (res.code == 200) {
          this.changeInfo = res.data;

          var changeInfo = res.data;
          var arr = [];
          changeInfo.log_list.map(item => {
            if (item.change_status == 20) {
              arr.push(item);
            }
          })
          if (arr.length > 0) {
            this.zjInfo = arr[0].form_data
          }
        }
        this.loading = false
      })
    }
  },
  methods: {

    // 提交
    saveSubmit() {
      this.$refs['elFrom'].validate((valid) => {
        if (valid) {
          let formData = this.formData
          this.submitBtn = true;
          if (formData.reviewPassed == 1) {
            idiApi.changeQuotationPassed({
              project_id: this.changeInfo.project_id,
              change_id: this.changeInfo.id,
              remark: formData.remark,
              audit_type: 1
            }).then(res => {
              console.log(res, '审核通过')
              if (res.code == 200) {
                this.$message({
                  message: "提交成功",
                  type: "success",
                });
                this.cancelFunc()
              } else {
                this.$message.error(res.message);
              }
              this.submitBtn = false;
            })
          } else {
            idiApi.changeQuotationRejected({
              project_id: this.changeInfo.project_id,
              change_id: this.changeInfo.id,
              remark: formData.remark
            }).then(res => {
              console.log(res, '审核拒绝')
              if (res.code == 200) {
                this.$message({
                  message: "提交成功",
                  type: "success",
                });
                this.cancelFunc()
              } else {
                this.$message.error(res.message);
              }
              this.submitBtn = false;
            })
          }
        } else {
          return false;
        }
      });
    },
    // 取消
    cancelFunc() {
      this.$goBackTab(this);
    },
  },
};
</script>
<style lang="scss" scoped>
@import "@/styles/shPage.scss";

.input-box {
  margin-bottom: 0 !important;
}
</style>